<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Lims</title>
    <link rel="stylesheet" type="text/css" href="../bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/bootstrap-table.css">
    <link rel="stylesheet" type="text/css" href="../css/common.css">
    <link rel="stylesheet" type="text/css" href="../css/manage.css">
    <link rel="stylesheet" type="text/css" href="../css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="../layer/skin/layer.css">
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
    <!-- 滚动条- -->
    <script type="text/javascript" src="../js/bootstrap-table.js"></script>
    <script type="text/javascript" src="../js/bootstrap-table-zh-CN.js"></script>
    <script type="text/javascript" src="../js/Jquery.ETTool-1.0.js"></script>
    <script type="text/javascript" src="../layer/layer.js"></script>
    <script type="text/javascript" src="../vendor/vue/vue.2.3.4.js"></script>
</head>
<style>
    .form-control {
        margin-bottom: 10px;
    }

    .btn-row {
        text-align: center;
    }
</style>

<body>
    <div id="lims">
        <div class="wrap animated fadeInRight pd-40">

            <h2 class="zh_title blod500">Lims</h2>
            <div class="row manage_btn">
                <div class="col-sm-12">
                    <button class="blue" v-on:click="clearLims()" data-toggle="modal" data-target="#newLims">新增</button>
                </div>
            </div>

            <div class="row manage_tb">
                <table cellpadding="0" cellspacing="0" id="limsTable">
                </table>
            </div>


        </div>
        <div class="modal fade" id="newLims" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true" id="">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">新增Lims</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-horizontal bv-form">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">数据源名</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="数据源名" v-model="newLims.dataSourceName" />
                                </div>
                                <label class="col-sm-2 control-label">服务地址</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="服务地址" v-model="newLims.host" />
                                </div>
                                <label class="col-sm-2 control-label">服务名</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="服务名" v-model="newLims.serviceName" />
                                </div>
                                <label class="col-sm-2 control-label">用户名</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="用户名" v-model="newLims.userName" />
                                </div>
                                <label class="col-sm-2 control-label">密码</label>
                                <div class="col-sm-4">
                                    <input type="password" class="form-control" placeholder="密码" v-model="newLims.password" />
                                </div>
                                <label class="col-sm-2 control-label">前缀</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="前缀" v-model="newLims.prefix" />
                                </div>
                                <label class="col-sm-2 control-label">是否启用</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="是否启用" v-model="newLims.inUse" />
                                </div>
                                <label class="col-sm-2 control-label">排序</label>
                                <div class="col-sm-4">
                                    <input type="number" class="form-control" placeholder="排序" v-model="newLims.orderNum" />
                                </div>
                                <label class="col-sm-2 control-label">创建人ID</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="创建人ID" v-model="newLims.crtUserId" />
                                </div>
                                <label class="col-sm-2 control-label">创建人名称</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="创建人名称" v-model="newLims.crtUserName" />
                                </div>
                                <label class="col-sm-2 control-label">创建时间</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="创建时间" v-model="newLims.crtDate" />
                                </div>
                                <label class="col-sm-2 control-label">更新人ID</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="更新人ID" v-model="newLims.mntUserId" />
                                </div>
                                <label class="col-sm-2 control-label">更新人名称</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="更新人名称" v-model="newLims.mntUserName" />
                                </div>
                                <label class="col-sm-2 control-label">更新时间</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="更新时间" v-model="newLims.mntDate" />
                                </div>
                                <label class="col-sm-2 control-label">策略编号</label>
                                <div class="col-sm-4">
                                    <select name="" id="" class="form-control" v-model="newLims.strategyCode">
                                        <option v-bind:value="code.value" v-for="code in strategyCodeList">
                                            {{code.name}}
                                        </option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="btn-row">
                                    <button type="submit" class="btn btn-primary" v-on:click="add()">提交</button>
                                    <button type="button" class="btn btn-info">重置</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal fade" id="editLims" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true" id="">&times;</span></button>
                        <h4 class="modal-title" id="myModalLabel">编辑Lims</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-horizontal bv-form">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">数据源名</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="数据源名" v-model="editLims.dataSourceName" />
                                </div>
                                <label class="col-sm-2 control-label">服务地址</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="服务地址" v-model="editLims.host" />
                                </div>
                                <label class="col-sm-2 control-label">服务名</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="服务名" v-model="editLims.serviceName" />
                                </div>
                                <label class="col-sm-2 control-label">用户名</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="用户名" v-model="editLims.userName" />
                                </div>
                                <label class="col-sm-2 control-label">密码</label>
                                <div class="col-sm-4">
                                    <input type="password" class="form-control" placeholder="密码" v-model="editLims.password" />
                                </div>
                                <label class="col-sm-2 control-label">前缀</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="前缀" v-model="editLims.prefix" />
                                </div>
                                <label class="col-sm-2 control-label">是否启用</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="是否启用" v-model="editLims.inUse" />
                                </div>
                                <label class="col-sm-2 control-label">排序</label>
                                <div class="col-sm-4">
                                    <input type="number" class="form-control" placeholder="排序" v-model="editLims.orderNum" />
                                </div>
                                <label class="col-sm-2 control-label">创建人ID</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="创建人ID" v-model="editLims.crtUserId" />
                                </div>
                                <label class="col-sm-2 control-label">创建人名称</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="创建人名称" v-model="editLims.crtUserName" />
                                </div>
                                <label class="col-sm-2 control-label">创建时间</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="创建时间" v-model="editLims.crtDate" />
                                </div>
                                <label class="col-sm-2 control-label">更新人ID</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="更新人ID" v-model="editLims.mntUserId" />
                                </div>
                                <label class="col-sm-2 control-label">更新人名称</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="更新人名称" v-model="editLims.mntUserName" />
                                </div>
                                <label class="col-sm-2 control-label">更新时间</label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" placeholder="更新时间" v-model="editLims.mntDate" />
                                </div>
                                <label class="col-sm-2 control-label">策略编号</label>
                                <div class="col-sm-4">
                                    <select name="" id="" class="form-control" v-model="editLims.strategyCode">
                                        <option v-bind:value="code.value" v-for="code in strategyCodeList">
                                            {{code.name}}
                                        </option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="btn-row">
                                    <button type="submit" class="btn btn-primary" v-on:click="update()">提交</button>
                                    <button type="button" class="btn btn-info">重置</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script>
    function isJSON(str) {
        if (typeof str == 'string') {
            try {
                JSON.parse(str);
                return true;
            } catch (e) {
                console.log(e);
                return false;
            }
        }
    }
    var domain = "http://10.238.119.5:8083/datasources/";
    var lims = new Vue({
        el: '#lims',
        data: {
            limsList: [],
            newLims: {
                dataSourceName: '',
                host: '',
                serviceName: '',
                userName: '',
                password: '',
                prefix: '',
                inUse: '',
                orderNum: '',
                crtUserId: '',
                crtUserName: '',
                crtDate: '',
                mntUserId: '',
                mntUserName: '',
                mntDate: ''
            },
            editLims: {},
            oldPrefix: '',
            strategyCodeList: [
                {
                    name: '广石化',
                    value: 'GSH'
                }, {
                    name: '济南石化',
                    value: 'JJSH'
                }, {
                    name: '九江石化',
                    value: 'JNSH'
                }, {
                    name: '茂名石化',
                    value: 'MMSH'
                }, {
                    name: '青岛炼化',
                    value: 'QDLH'
                }, {
                    name: '齐鲁腈纶',
                    value: 'QLJL'
                }, {
                    name: '齐鲁炼油',
                    value: 'QLLY'
                }, {
                    name: '上海石化',
                    value: 'SHSH'
                }, {
                    name: '天津石化',
                    value: 'TJSH'
                }, {
                    name: '镇海石化',
                    value: 'ZHSH'
                }
            ]
        },
        methods: {
            clearLims: function () {
                this.newLims = {
                    dataSourceName: '',
                    host: '',
                    serviceName: '',
                    userName: '',
                    password: '',
                    prefix: '',
                    inUse: '',
                    orderNum: '',
                    crtUserId: '',
                    crtUserName: '',
                    crtDate: '',
                    mntUserId: '',
                    mntUserName: '',
                    mntDate: ''
                }
            },
            add: function () {
                var limsData = [];
                for (var p in this.newLims) {
                    var obj = {};
                    obj.name = p;
                    obj.value = this.newLims[p];
                    limsData.push(obj);
                }
                var data = {
                    "collection": {
                        "version": "1.0",
                        "href": "/datasources",
                        "templates": [
                            {
                                "data": limsData
                            }
                        ]
                    }
                }
                $.ajax({
                    url: domain,
                    async: false,
                    type: 'POST',
                    data: JSON.stringify(data),
                    'processData': false,
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    success: function (result) {
                        if (result == 1) {
                            layer.msg("新增成功")
                            setTimeout(function () {
                                window.location.reload();
                            }, 500)
                        } else {
                            layer.msg(result.collection.error.message)
                        }
                    }, error: function () {
                        alert("网络出错啦")
                    }
                })
            },
            update: function () {
                var oldPrefix = this.oldPrefix;
                var limsData = [];
                for (var p in this.editLims) {
                    var obj = {};
                    obj.name = p;
                    obj.value = this.editLims[p];
                    limsData.push(obj);
                }
                var data = {
                    "collection": {
                        "version": "1.0",
                        "href": "/datasources",
                        "templates": [
                            {
                                "data": limsData
                            }
                        ]
                    }
                }
                $.ajax({
                    url: domain + oldPrefix,
                    type: 'PUT',
                    data: JSON.stringify(data),
                    'processData': false,
                    contentType: "application/json;charset=utf-8",
                    dataType: "text",
                    success: function (result) {
                        if (!isJSON(result)) {
                            layer.msg("修改成功")
                            setTimeout(function () {
                                window.location.reload();
                            }, 500)
                        } else {
                            layer.msg(result.collection.error.message);
                        }
                    }, error: function () {
                        alert("网络出错啦")
                    }
                })
            }
        }
    })
    $(function () {
        $.ajax({
            url: domain,
            async: false,//
            type: 'GET',//PUT DELETE POST
            success: function (result) {
                var data = $.ET.toObjectArr(result);
                lims.limsList = data;
                initTable(data)
            }, error: function () {
                alert("网络错误,请稍后再试")
            }
        })
    });

    function initTable(data) {
        $('#limsTable').bootstrapTable({
            data: data,
            pagination: true, //启动分页
            pageSize: 10,  //每页显示的记录数
            pageNumber: 1, //当前第几页
            columns: [
                {
                    field: '',
                    title: '序号',
                    formatter: function (value, row, index) {
                        return index + 1;
                    },
                    sortable: true
                },
                {
                    field: 'dataSourceName',
                    title: '数据源名',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'host',
                    title: '服务地址',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'serviceName',
                    title: '服务名',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'userName',
                    title: '用户名',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'password',
                    title: '密码',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'prefix',
                    title: '前缀',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'inUse',
                    title: '是否启用',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'orderNum',
                    title: '排序',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'crtUserId',
                    title: '创建人ID',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'crtUserName',
                    title: '创建人名称',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'crtDate',
                    title: '创建时间',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'mntUserId',
                    title: '更新人ID',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'mntUserName',
                    title: '更新人名称',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'mntDate',
                    title: '更新时间',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'strategyCode',
                    title: 'strategyCode',
                    align: 'center',
                    valign: 'middle'
                }, {
                    field: 'appCode',
                    title: '操作',
                    align: 'center',
                    valign: 'middle',
                    formatter: function (value, row, index) {
                        var e = '<a href="#" mce_href="#" data-toggle="modal" data-target="#editLims" onclick="editLims(\'' + row.prefix + '\')">修改</a> ';
                        var d = '<a href="#" mce_href="#" onclick="deleteLims(\'' + row.prefix + '\')">删除</a> ';
                        return e + d;
                    }
                }]
        });
    }
    function editLims(code) {
        for (var i = 0; i < lims.limsList.length; i++) {
            var item = lims.limsList[i];
            if (item.prefix == code) {
                lims.oldPrefix = item.prefix;
                lims.editLims = item;
                break;
            }
        }
    }
    function deleteLims(code) {
        $.ajax({
            url: domain + code,
            type: 'DELETE',
            dataType: "text",
            success: function (result) {
                layer.msg("删除成功")
                setTimeout(function () {
                    window.location.reload()
                }, 500);
            }
        })
    }

</script>

</html>